<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript" src="angular.min.js"></script>
<script type="text/javascript" src="angular-route.js"></script> 
<script type="text/javascript" src="angular-ui-router.js"></script>
<!-- http://www.bootcdn.cn/angular-ui-router/ -->
</head>
<body>
<!-- <div ng-app="myApp" ng-controller="myAppControl">
	{{username}}
	<div ng-view></div>
</div>
<script type="text/javascript">
//简单路由
var myApp = angular.module('myApp',['ngRoute']);
myApp.config(['$routeProvider',function($routeProvider){
	$routeProvider.when('/a',{
		template : '这是a',
	}).when('/b',{
		template : '这是b'
	});
}]);
myApp.controller('myAppControl',function(){});
</script> -->
<!-- <div ng-app="myApp" ng-controller="myAppControl">
	<div ng-view></div>
	<script type="text/ng-template" id='a'><h1>你好A</h1></script>
	<script type="text/ng-template" id='b'><h1>你好B</h1></script>
</div>
<script type="text/javascript">
//简单路由
var myApp = angular.module('myApp',['ngRoute']);
myApp.config(['$routeProvider',function($routeProvider){
	$routeProvider.when('/a',{
		templateUrl : 'a',
	}).when('/b',{
		templateUrl : 'b'
	});
}]);
myApp.controller('myAppControl',function(){});
</script> -->
<div ng-app="myApp">
	<h1>多ui-view</h1>
    <div ui-view></div>
    <div ui-view="chart"></div> 
    <div ui-view="data"></div> 
</div>
<!-- 参考文章：http://blog.csdn.net/ligang2585116/article/details/50380343 -->
<script type="text/javascript">
// App.js
// App2.js
var myApp = angular.module("myApp", ["ui.router"]);
myApp.config(function ($stateProvider, $urlRouterProvider) {
    $urlRouterProvider.when("", "/home");
    $stateProvider.state("home", {
            url: "/home",
            views: {
                "": {
                    template: "<h1>HELLO!</h1>"
                },
                "chart": {
                    template: "chart"
                },
                "data": {
                    template: "data"
                }
            }
        })
        .state("index", {
            url: "/index",
            views: {
                "": {
                    template: "<h1>HELLO!</h1>"
                },
                "data": {
                    template: "data-index"
                }
            }
        })   
});
</script>

</body>
</html>